<template>
  <div id="app">
    <header class="head">
      <a class="back tl" href="javascript:history.back(-1)">
        <i class="el-icon-arrow-left"></i>
      </a>
      <a href="javascript:;" class="tc">
        <small class="font_18 co_f">人员档案</small>
      </a>
    </header>
    <main>
      <div class="seachfrom">
        <div class="seachbox">
          <el-input placeholder="请输入内容" v-model="seachtext">
            <el-button slot="append" icon="search"></el-button>
          </el-input>
        </div>
      </div>
      <div>
      <ul class="datalist">
        <li v-for='item of listData' :key='item.unid'>
         <router-link :to='{name:"Mrcjlistadd", query:{name:item.name,unid:item.unid}}'>
           姓名:{{item.name}}
         </router-link>
        </li>
      </ul>
      </div>
    </main>
  </div>
</template>

<script>
  import {EnterprisePersonData} from '../../api/api';
  export default {
    data() {
      return {
        PageSize: 0,
        CriteriaList:[],
        listData: [],
        Enterprise:{},
        seachtext:'',
      };
    },
    methods: {
      
         getData() {
        this.PageSize+=10;
        //定义需要传给通讯的参数：QueryData{"PageSize":10,"CurrentPage":1,"Query":{"CriteriaList":[]}}和userunid   Enterprise.Unid
        let varQueryData = {
          PageSize: this.PageSize,
          CurrentPage:1,
          Query: {
            CriteriaList:this.CriteriaList
          }
        }
        let query ={
          Name:'Enterprise.Unid',//Enterprise.Unid
          Value:JSON.parse(localStorage.getItem('auth')).enterpriseUnid,
          Operate:"Equal",
          DataType:null,
          EndSuffix:"",
          Suffix:null
        }
        varQueryData.Query.CriteriaList.push(query)//往数组里面添加对象
        let options = {
          params: {
            UserUnid: JSON.parse(localStorage.getItem('auth')).UserUnid,
            QueryData: JSON.stringify(varQueryData),
          //Enterprise.Unid:,
          }
        }
        //调取接口
        EnterprisePersonData(options).then((res) => {
          if (res.success === true) {
            this.user = res.data.user;
            this.listData = res.data;
          }
        })
      }
    },
    beforeRouteLeave(to, from, next) {
         // 设置下一个路由的 meta
        to.meta.keepAlive = true;  // 让 A 缓存，即不刷新
        next();
    },
    //页面加载时候
    mounted() {
      this.getData();
      //监听滚动
    }
   
  }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->

<style lang="scss" scoped>
  //头部
  body {
    background: #f0f0f0;
  }
  
  a {
    list-style: none;
    text-decoration: none;
  }
  
  header {
    width: 100%;
    height: 45px;
  }
  
  .head {
    background: #008c3f;
    color: #fff;
    line-height: 45px;
    text-align: center;
    font-size: 1.2rem;
    position: relative;
  }
  
  header .head a:nth-child(2) {
    width: 100%;
  }
  
  .font_18 {
    font-size: 18px;
  }
  
  .co_f {
    color: #fff !important;
  }
  
  .back {
    position: absolute;
    top: 0px;
    left: 0px;
    i {
      color: #fff;
      vertical-align: middle;
      margin-left: 5px;
    }
  }
  .adds{
    position: absolute;
    top: 0px;
    right: 0px;
   i{
      color: #fff;
      vertical-align: middle;
      margin-right: 5px;
   }
  }
  //seachfrom
   .seachfrom{ background:#f5f5f5; padding:10px 15px;}

  //list_box
  .datalist {
    width: 100%;
  }
  
  .datalist li {
    border-bottom: 1px solid #d4d4d4;
    padding: 10px;
  }
  .datalist li a{ display:block}
  
  .items-img {
    width: 50px;
    height: 50px;
    display: block;
    display: inline-block;
    float: left;
    margin-top: 7px;
  }
  
  .items-img img {
    width: 100%;
    height: 100%;
  }
  
  .items-text {
    margin-left: 60px;
    font-size: 12px;
  }
  
  .items-text p {
    margin: 0px;
  }
</style>
